<template>
  <div>
    <h1>App</h1>
    <!-- 
      传递普通数据：直接子组件使用（父 -> 子）
      传递函数数据：子组件调用函数，从而修改父组件数据（子 -> 父）
     -->
    <Child :name="person.name" :age="person.age" :setAge="setAge" />
  </div>
</template>

<script>
import Child from "./Child.vue";

export default {
  name: "App",
  data() {
    return {
      person: {
        name: "静哥",
        age: 38,
      },
    };
  },
  methods: {
    setAge() {
      this.person.age++;
    },
  },
  components: {
    Child,
  },
};
</script>

<style></style>
